page {
  --sar-tree-border-color: var(--sar-border-color);
  --sar-tree-bg: var(--sar-emphasis-bg);
  --sar-tree-duration: var(--sar-duration);

  --sar-tree-node-height: 40px;
  --sar-tree-node-padding-x: 16px;
  --sar-tree-node-padding-y: 10px;
  --sar-tree-node-bg: var(--sar-emphasis-bg);
  --sar-tree-node-active-bg: var(--sar-active-bg);
  --sar-tree-node-dragging-bg: var(--sar-mask-white-legible);
  --sar-tree-node-dragging-shadow: 0 0 1px 1px rgb(0 0 0 / 0.2),
    0 1px 10px rgb(0 0 0 / 0.2);

  --sar-tree-toolbar-margin-right: -12px;

  --sar-tree-indent-width: 24px;

  --sar-tree-arrow-padding-x: 12px;
  --sar-tree-arrow-font-size: 12px;
  --sar-tree-arrow-color: var(--sar-tertiary-color);
  --sar-tree-arrow-duration: var(--sar-duration);

  --sar-tree-selection-padding-x: 12px;

  --sar-tree-edit-padding-x: 12px;
  --sar-tree-edit-font-size: 18px;
  --sar-tree-edit-color: var(--sar-quaternary-color);
  --sar-tree-edit-active-opacity: var(--sar-active-opacity);

  --sar-tree-level-btn-padding-x: 12px;
  --sar-tree-level-btn-font-size: 18px;
  --sar-tree-level-btn-color: var(--sar-quaternary-color);
  --sar-tree-level-btn-active-opacity: var(--sar-active-opacity);

  --sar-tree-drag-padding-x: 12px;
  --sar-tree-drag-font-size: 18px;
  --sar-tree-drag-color: var(--sar-quaternary-color);
  --sar-tree-drag-active-opacity: var(--sar-active-opacity);
}